<template>
  <div class="orderlist">
    <van-nav-bar
      fixed
      left-text="返回"
      left-arrow
      :title="!isWeixin() ? '转单记录' : ''"
      @click-left="handleBack"
    />
    <div class="inner">
      <div class="pageLoading" v-if="pageLoading">
        <van-loading type="spinner" vertical>加载中...</van-loading>
      </div>
      <div class="have" v-if="!pageLoading && list.length">
        <van-list
          v-model:loading="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="onLoad"
        >
          <div
            class="have-item"
            v-for="(item, index) in list"
            @click="handelDetail(item)"
            :key="index"
          >
            <div class="item-top">
              <div class="clumns">
                <div class="text bluecolor">转单信息：{{ item.title }}</div>
              </div>
              <div class="clumns" v-if="item.content">
                <div class="text">转单需求：{{ item.content }}</div>
              </div>
              <div class="clumns">
                <div class="text">
                  转单时间：{{
                    dayjs.unix(item.addtime).format("YYYY-MM-DD HH:mm:ss")
                  }}
                </div>
              </div>
              <div class="clumns">
                <div class="text w-50">客户姓名：{{ item.name }}</div>
                <div class="text w-50">
                  客户电话：<span class="bluecolor">{{ item.phone }}</span>
                </div>
              </div>
              <div class="clumns num">
                <div class="text w-33">销售次数：{{ item.buynum }}</div>
                <div class="text w-33">剩余次数：{{ 4 - item.buynum }}</div>
              </div>
            </div>

            <div class="item-footer">
              <!-- <div class="status">
                状态：<span class="bluecolor">已推送</span>
              </div> -->
              <div class="action">
                <!-- <van-button type="primary" size="small">编辑转单</van-button> -->
              </div>
            </div>
          </div>
        </van-list>
      </div>
      <div class="none" v-if="!pageLoading && !list.length">
        <van-empty description="暂无记录" />
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { getCookie } from "@/utils/index";
import { ref, reactive } from "vue";
import { useRouter } from "vue-router";
import { isWeixin } from "@/utils/index";
import { procuresApi } from "@/api/user";
import dayjs from "dayjs";
const router = useRouter();
const list = ref();
const pageLoading = ref(false);
const finished = ref(false);
const loading = ref(false);
const pagination = reactive({
  pageNo: 1,
  pageSize: 10,
});
const handleBack = () => {
  if (history.state?.back) {
    router.back();
  } else {
    router.push("/user");
  }
};
const getList = async () => {
  pageLoading.value = true;
  let { data } = await procuresApi({
    uid: getCookie("token") ? Number(getCookie("token")) : "",
    pageNo: pagination.pageNo,
    pageSize: pagination.pageSize,
  });
  list.value = data.data || [];
  if (data.totalPage === 1) {
    finished.value = true;
  }
  pageLoading.value = false;
};
getList();
const onLoad = async () => {
  pagination.pageNo++;
  let { data } = await procuresApi({
    uid: getCookie("token") ? Number(getCookie("token")) : "",
    pageNo: pagination.pageNo,
    pageSize: pagination.pageSize,
  });
  loading.value = false;
  list.value = [...list.value, ...data.data];
  if (pagination.pageNo >= data.totalPage) {
    finished.value = true;
  }
};
const handelDetail = (data: any) => {
  router.push("/detail/" + data.id);
};
</script>
<style lang="scss" scoped>
@import "./index.scss";
</style>
